<template>
    <view class="bg-[#f8f8f8]">
        <view class="h-[10rpx]"></view>
        <view class="pt-[30rpx] pb-[20rpx] bg-[#fff] font-medium">
            <view class="flex flex-col items-center justify-center px-[38rpx] pb-[60rpx] text-[#3D3D3D] text-[38rpx]">
                <view class="">标题标题标题</view>
                <view class="mt-[17rpx] indent-[2em]">内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容</view>
                <image class="w-[650rpx] h-[353rpx] mt-[22rpx]"
                    src="https://www.aqvtc.edu.cn/_upload/article/images/75/c2/589547794559a79e48ba9ab6fdfa/469aac11-9132-4451-a77a-019a3324ba9c_d.jpg">
                </image>
            </view>
            <view class="h-[2rpx] bg-[#EFEFEF]"></view>
            <view class="px-[38rpx] text-[34rpx]">
                <view class="mt-[35rpx]">
                    <text>定位：</text>
                    <text>七星社区教学点</text>
                </view>
                <view class="mt-[15rpx]">
                    <text>描述：</text>
                    <text>七星路28号三楼208室</text>
                </view>
            </view>

        </view>
        <view class="ml-[38rpx] mt-[25rpx] mb-[10rpx] text-[38rpx]">最近课程</view>

        <view v-for="(item, index) in 3" :key="index" @click="navigateTo('/pages/eventDetails/eventDetails')"
            class="mt-[16rpx] shadow ml-[12rpx] mr-[18rpx] bg-white pl-[30rpx] pr-[10rpx] pt-[20rpx]">
            <view class="text-[#3D3D3D]  mb-[12rpx] flex justify-between items-end"><text
                    class="text-[32rpx]">风祥小区教学点</text><text class="text-[28rpx] ">3.8km</text>
            </view>
            <view class="flex pb-[26rpx]">
                <image class="w-[200rpx] h-[200rpx]"
                    src="https://gangantao.com/image/20241216/da0e780c-e279-4d0e-be12-9ab9486ffaf7.png"></image>
                <view class="ml-[16rpx] flex-1 flex flex-col justify-between h-[200rpx]">
                    <view class="flex items-start justify-between w-full">
                        <view class="flex items-start">
                            <view class=" text-white text-[28rpx] bg-[#FD755D] rounded px-1  mr-[12rpx] tracking-wider">
                                一级学院</view>
                            <view class=" text-white text-[28rpx] bg-[#FD755D] rounded px-1">二级学院</view>
                        </view>
                        <view class="text-[#FF0000] text-[44rpx]">68元</view>
                    </view>
                    <view class="text-[32rpx] text-[#3D3D3D]">楷书毛笔字课程</view>
                    <view class="text-[28rpx] text-[#3D3D3D] ">2024.10.10</view>
                    <view class="flex items-end justify-between">
                        <view class="flex">
                            <view class=" text-white text-[28rpx] bg-[#FFA812] rounded px-1 mr-[12rpx]">学分兑换</view>
                            <view class=" text-white text-[28rpx] bg-[#FFA812] rounded px-1 mr-[12rpx]">社区</view>
                            <view class=" text-white text-[28rpx] bg-[#FFA812] rounded px-1">艺术</view>
                        </view>

                        <view class=" text-white py-[10rpx] px-4 bg-[#FD755D] rounded  text-[32rpx]">报名</view>
                    </view>
                </view>
            </view>
        </view>
        <view class="h-[30rpx]"></view>
    </view>
</template>
<script setup>

</script>
<style scoped></style>